<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/commons/res/taglibs.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="${ctx }/static/libs/jquery.js"></script>
<title>Main JSo</title>
<script type="text/javascript">
$(function(){
		console.log('init');
	$('button[role="test"]').click(function(){
		console.log('Start');
		$.ajax({
			url:'${ctx }/testJson',
			headers:{"o-ajax-token":"213424234234234"},
			complete:function(xhr, ts){
				//console.log(xhr);
				console.log(xhr.getResponseHeader("Content-Type"));
				console.log(xhr.getAllResponseHeaders());
			},
			success:function(t){
				console.log(t);
			}
		});
	});
	var $ajaxContentContainer=$("#ajax-content-container");
	$('button[role="loadHtmlByAjax"]').click(function(){
		console.info('loadHtmlByAjax start ...........');
		$.ajax({
			url:'${ctx }/testHtml',
			//dataType:'html',
			success:function(t){
				console.log(t);
				$ajaxContentContainer.append(t);
				
			}
		});
	});
})
</script>
</head>
<body>
<input type="hidden" name="token" value="${token}" />
	Hello World!
	<button role="test">Test</button>
	<button role="loadHtmlByAjax">loadHtmlByAjax</button>
	<div id="ajax-content-container"></div>
</body>
</html>